import { observable, action, runInAction, flow, computed, configure } from "mobx";
import axios from 'axios';

configure({ // 强制mobx只能通过 @action 修改状态
  enforceActions: 'observed'
});

// 1、创建 store 对象 存储默认状态0
class CounterStore {
  @observable count = 0;
  @observable users = [];

  @action.bound increment() {
    this.count = this.count + 1;
  }

  @action.bound decrement() {
    this.count = this.count - 1;
  }

  @action.bound async getData1() {
    const { data } = await axios.get('https://api.github.com/users')
    runInAction(() => {
      this.users = data;
    });
  }

  getData = flow(function* () {
    const { data } = yield axios.get('https://api.github.com/users');
    this.users = data;
  }).bind(this);

  @computed get getResult() {
    return this.count * 10 + 1;
  }
}
const counter = new CounterStore();
export default counter;
// 2、将store对象放在一个全局的组件可以够得着的地方
// 3、让组件获取store对象中的状态，并将状态显示在组件中

